<template>
  <el-form ref="service" :model="service" label-width="100px" class="width-500">
    <el-form-item label="购买会员">
      {{service.memberName}}
    </el-form-item>
    <el-form-item label="购买服务包">
      {{service.productTitle}}
    </el-form-item>
    <!-- <el-form-item label="诊断信息">
      {{service.reportContent}}
    </el-form-item> -->
    <el-form-item label="报告资料">
     <template>
        <ul>
          <li v-for="(item, index) in dowloadServiceImages" :key="`fruit-${index}`" style="list-style:none;float:left; padding-left:10px">
            <img v-bind:src="item" style="width:100px;"/>
          </li>
        </ul>
      </template>
    </el-form-item>
    <el-dialog :visible.sync="dialogVisible" append-to-body>
      <img width="100%" :src="dialogFileUrl" alt="">
    </el-dialog>
  </el-form>
</template>

<script>
export default {
  data () {
    return {
      dialogFileUrl: '',
      dialogVisible: false,
    }
  },
  props: [
    'service',
    'dowloadServiceImages'
  ],
  methods: {
    filePreview(row) {
      this.dialogFileUrl = row.url;
      this.dialogVisible = true;
    }
  }
}
</script>
